<template>
	<div>
		<!-- 头部 -->
		<Header @getHeader="getHeader"></Header>
		<!-- 正在进行中|已经完成 -->
		<Panl
			@endToRun="endToRun"
			@runToEnd="runToEnd"
			:runings="runings"
			:ends="ends"
		></Panl>
	</div>
</template>

<script>
import Header from './Header'
import Panl from './Panl'
export default {
	data() {
		return {
			// 正在进行中
			runings: [],
			// 已完成
			ends: [],
		}
	},
	methods: {
		// 从正在进行中到已经完成
		runToEnd(index) {
			// console.log(index)
			const item = this.runings.splice(index, 1)
			// 插入到ends
			this.ends.push(item[0])
		},
		// 从已经完成到正在进行中
		endToRun(index) {
			console.log(index)
		},
		// 接收头部输入的内容
		getHeader(value) {
			// 放在正在进行中数据中
			this.runings.push(value)
		},
	},
	components: { Header, Panl },
}
</script>